<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <link rel="stylesheet" href="/static/index/css/amazeui.min.css">
    <link rel="stylesheet" href="/static/index/css/wap.css">
    <title>小萌萌</title>
</head>
<body style="background:#ececec">
<div class="pet_mian">
    <div class="pet_head">
        <header data-am-widget="header"
                class="am-header am-header-default pet_head_block">
            <div class="am-header-left am-header-nav ">
                <a href="javascript:history.go(-1);" class="iconfont pet_head_jt_ico">&#xe601;</a>
            </div>
            <div class="pet_news_list_tag_name">{$user.username}</div>
            <div class="am-header-right am-header-nav">
                <a href="{:url('index/index/index')}" class="iconfont pet_head_gd_ico">&#xe600;</a>
            </div>
        </header>
    </div>
    <div class="pet_content pet_content_list">
        <div class="pet_grzx">

            <div class="pet_grzx_nr">
                <div class="pet_grzx_ico">
                    <img src="/static/index/img/qq1.png" alt="">
                </div>
                <div class="pet_grzx_name">{$user.username}</div>
                <!--<div class="pet_grzx_map">美国</div>-->
                <div class="pet_grzx_num_font">
                    我坐在水屋下边的平台看着大海，吹着海风，真的是太喜欢了。夜晚有好多小白鲨鱼，好多种鱼。
                </div>
                <div class="pet_grzx_num">
                    <span><a type="button" class="am-btn am-btn-secondary am-round mypass">修改密码</a></span>
                    <span><a type="button" class="am-btn am-btn-secondary am-round myinfo">完善信息</a></span>
                    <span><a type="button" class="am-btn am-btn-secondary am-round mycourse">我的课程</a></span>
                </div>
                <div class="pet_grzx_num">
                    <span><a type="button" class="am-btn am-btn-secondary am-round mystudent">我的学员</a></span>
                    <span><a type="button" class="am-btn am-btn-secondary am-round myactivity">我的活动</a></span>
                    <span><a type="button" href="{:url('index/person/exit')}" class="am-btn am-btn-secondary am-round myexit">我要退出</a></span>
                </div>
            </div>

            <div class="pet_grzx_list">
                <div class="pet_content_main pet_article_like_delete doinfo" style="display: none">
                    <div data-am-widget="list_news" class="am-list-news am-list-news-default am-no-layout">
                        <form class="am-form am-form-horizontal" action="{:url('index/Person/info')}" method="post">
                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">手机</label>
                                <div class="am-u-sm-10">
                                    <input type="tel" name="utel" class="am-round" id="doc-ipt-3" placeholder="输入你的手机号"
                                           value="{$user.utel}" maxlength="11">
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">昵称</label>
                                <div class="am-u-sm-10">
                                    <input type="text" name="username" class="am-round"
                                           placeholder="输入你的昵称" value="{$user.username}">
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">姓名</label>
                                <div class="am-u-sm-10">
                                    <input type="text" name="uname" class="am-round" placeholder="输入你的姓名"
                                           value="{$user.uname}">
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">邮箱</label>
                                <div class="am-u-sm-10">
                                    <input type="email" name="uemail" class="am-round"
                                           placeholder="输入你的邮箱" value="{$user.uemail}">
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">QQ</label>
                                <div class="am-u-sm-10">
                                    <input type="text" name="qq" class="am-round" placeholder="输入你的QQ"
                                           value="{$user.qq}">
                                </div>
                            </div>

                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">年龄</label>
                                <div class="am-u-sm-10">
                                    <input type="text" name="uage" class="am-round" placeholder="输入你的年龄"
                                           value="{$user.uage}">
                                </div>
                            </div>

                            <div class="am-form-group">
                                <div class="am-u-sm-7 am-u-sm-offset-5">
                                    <button type="submit" class="am-btn am-btn-primary am-round">提交</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>

                <div class="pet_content_main pet_article_like_delete dopass" style="display: none">
                    <div data-am-widget="list_news" class="am-list-news am-list-news-default am-no-layout">
                        <form class="am-form am-form-horizontal" action="{:url('index/Person/dover')}" method="post">
                            <div class="am-form-group">
                                <label for="doc-ipt-3" class="am-u-sm-2 am-form-label">手机</label>
                                <div class="am-u-sm-10">
                                    <input type="tel" name="utel" class="am-round" placeholder="输入你的手机号"
                                           value="18434393102" maxlength="11">
                                </div>
                            </div>
                            <div class="am-form-group am-u-sm-12">
                                <label for="doc-ipt-4" class="am-u-sm-2 am-form-label">验证码</label>
                                <div class="am-u-sm-5">
                                    <input type="tel" name="uver" class="am-round ver" id="doc-ipt-4"
                                           placeholder="输入你的短信验证码">
                                </div>
                                <div class="am-u-sm-5">
                                    <a type="submit" class="am-btn am-btn-primary am-round mybutton">获取验证码</a>
                                </div>
                                <p>&nbsp;</p>
                                <div class="am-form-group">
                                    <div class="am-u-sm-7 am-u-sm-offset-5">
                                        <button type="submit" class="am-btn am-btn-primary am-round">提交</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>

                <div class="am-container docourse" style="display: none">
                    <table class="am-table">
                        <thead>
                        <tr>
                            <th width="33%" class="am-text-center">班期名称</th>
                            <th width="33%" class="am-text-center">开课时间</th>
                            <th width="33%" class="am-text-center">课程时长</th>
                        </tr>
                        </thead>
                        <tbody>
                        {volist name="classname" id="class"}
                        <tr>
                            <td class="am-text-center">{$class.classname}</td>
                            <td class="am-text-center">{$class['starttime']}</td>
                            <td class="am-text-center">{$class.longtime}个月</td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div>

                <div class="am-container student" style="display: none">
                    <table class="am-table">
                        <thead>
                        <tr>
                            <th width="33%" class="am-text-center">学员账号</th>
                            <th width="33%" class="am-text-center">所学课程</th>
                            <th width="33%" class="am-text-center">我的佣金</th>
                        </tr>
                        </thead>
                        <tbody>
                        {volist name="student" id="data"}
                        <tr>
                            <td class="am-text-center">{$data[0]}</td>
                            <td class="am-text-center">{$data[1]}</td>
                            <td class="am-text-center">
                                {if condition="empty($data[2])"}未参加活动
                                {else /} {$data[2]}元
                                {/if}
                                </td>
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div>

                <div class="am-container activity" style="display: none">
                    <table class="am-table">
                        <thead>
                        <tr>
                            <th width="50%" class="am-text-center">活动名称</th>
                            <th width="50%" class="am-text-center">活动优惠</th>
                            <!--<th width="33%" class="am-text-center"></th>-->
                        </tr>
                        </thead>
                        <tbody>
                        {volist name="act" id="data"}
                        <tr>
                            <td class="am-text-center">{$data['name']}</td>
                            <td class="am-text-center">{$data['concession']}</td>
                            <!--<td class="am-text-center">-->
                                <!--{if condition="empty($data[2])"}未参加活动-->
                                <!--{else /} {$data[2]}元-->
                                <!--{/if}-->
                            <!--</td>-->
                        </tr>
                        {/volist}
                        </tbody>
                    </table>
                </div>

            </div>
            <div class="pet_article_dowload">
                <div class="pet_article_dowload_title">关于Amaze UI</div>
                <div class="pet_article_dowload_content">
                    <div class="pet_article_dowload_triangle"></div>
                    <div class="pet_article_dowload_ico"><img src="/static/index/img/footdon.png" alt=""></div>
                    <div class="pet_article_dowload_content_font">
                        Amaze UI 以移动优先（Mobile first）为理念，从小屏逐步扩展到大屏，最终实现所有屏幕适配，适应移动互联潮流。
                    </div>
                    <div class="pet_article_dowload_all">
                        <a href="###" class="pet_article_dowload_Az am-icon-apple"> App store</a>
                        <a href="###" class="pet_article_dowload_Pg am-icon-android"> Android</a>
                    </div>
                </div>
            </div>
        </div>

        <div class="pet_article_footer_info">Copyright(c)2015 PetShow All Rights Reserved</div>
    </div>
</div>
<script src="/static/index/js/jquery.min.js"></script>
<script src="/static/index/js/amazeui.min.js"></script>
<script>
    $(function () {
        auto_resize();
        $(window).resize(function () {
            auto_resize();
        });
        $('.am-list-thumb img').load(function () {
            auto_resize();
        });
        $('.pet_article_like li:last-child').css('border', 'none');
        function auto_resize() {
            $('.pet_list_one_nr').height($('.pet_list_one_img').height());
        }

        $('.pet_article_user').on('click', function () {
            if ($('.pet_article_user_info_tab').hasClass('pet_article_user_info_tab_show')) {
                $('.pet_article_user_info_tab').removeClass('pet_article_user_info_tab_show').addClass('pet_article_user_info_tab_cloes');
            } else {
                $('.pet_article_user_info_tab').removeClass('pet_article_user_info_tab_cloes').addClass('pet_article_user_info_tab_show');
            }
        });

        $('.pet_head_gd_ico').on('click', function () {
            $('.pet_more_list').addClass('pet_more_list_show');
        });
        $('.pet_more_close').on('click', function () {
            $('.pet_more_list').removeClass('pet_more_list_show');
        });
        $('.myinfo').click(function () {
            $('.docourse').slideUp();
            $('.dopass').slideUp();
            $('.student').slideUp();
            $('.doinfo').slideToggle();
        });
        $('.mycourse').click(function () {
            $('.doinfo').slideUp();
            $('.dopass').slideUp();
            $('.student').slideUp();
            $('.activity').slideUp();
            $('.docourse').slideToggle();
        });
        $('.mystudent').click(function () {
            $('.doinfo').slideUp();
            $('.dopass').slideUp();
            $('.docourse').slideUp();
            $('.activity').slideUp();
            $('.student').slideToggle();
        });
        $('.mypass').click(function () {
            $('.doinfo').slideUp();
            $('.docourse').slideUp();
            $('.student').slideUp();
            $('.activity').slideUp();
            $('.dopass').slideToggle();
        });
        $('.myactivity').click(function () {
            $('.doinfo').slideUp();
            $('.docourse').slideUp();
            $('.student').slideUp();
            $('.dopass').slideUp();
            $('.activity').slideToggle();
        });
        $('.mybutton').click(function () {
            var btn = $(this);
            var i = 60;
            var ver = $('.ver');
//            console.log(111);
            $.ajax({
                url: "{:url('index/Person/msg')}",
                type: 'post',
                datatype: 'html',
                success: function (data) {
//                    console.log(data);
//                    if(data){
                        console.log(data);
//                    }
                }

            });
            btn.attr("disabled", true);
//            console.log(111);
//
            var timer = setInterval(function () {
                i--;
                btn.html(i + 's后重新获取验证码');
                if (i <= 0) {
                    clearInterval(timer);
                    btn.attr("disabled", false);
                    btn.html('重新获取验证码');
                }
            }, 1000)
        });
    });

</script>
</body>
</html>